<template>
  <div>
      <!-- 导航栏 -->
    <van-nav-bar
      title="详情页面"
      left-text="返回"
      left-arrow
      @click-left="$router.go(-1)"
    />
    <!-- 页面显示信息 -->
   <van-image :src="xqList.pic" />
    <p>{{ xqList.title }}</p>
    <p>￥{{ xqList.price }}</p>
    <van-button type="danger" @click="addCart(xqList)">加入购物车</van-button>
  </div>
</template>
<script>
export default {
  data() {
    return {
        xqList:[],
    };
  },
  created(){
      this.getList();
  },
  methods: {
   //获取商品的数据列表接口
        getList(){
            let id = this.$route.query.id
            this.$axios.get('/json/list.json').then(res=>{
                console.log(res.result);
                this.xqList = res.result.find(item=>{
                    return item._id == id 
                })
            })
        },
         //加入购物车的方法
    addCart(goods){
        console.log('购物车的数据',goods);
        this.$set(goods,'checked',false);
        this.$set(goods,'num',1);
        this.$store.commit('addCart1',goods);
        this.$toast.success('加入购物车成功')
    }
  },
};
</script>